[#include "../../../common/html.ftl" /]
[@html]
    [@head title="修改组织机构部门信息" css=["fw", "ztree-ajax"] /]
    [@body]
        [@formMain ]
            <div class="fw-forms">
                [@dataForm formId="form-dept-edit" ]
                    <input type="hidden" name="deptId" value="${(sysDept.deptId)!}" />
                    <input id="deptTreeId" type="hidden" name="parentId" value="${sysDept.parentId}"/>
                    <div class="am-form-group am-u-sm-12 am-u-md-6 am-u-lg-4">
                        <label class="is-required">部门名称：</label>
                        <input class="am-form-field am-radius" type="text" name="deptName" value="${(sysDept.deptName)!}" required/>
                    </div>
                    <div class="am-form-group am-form-icon am-u-sm-12 am-u-md-6 am-u-lg-4">
                        <label class="is-required">上级部门：</label>
                        <i class="am-icon-sitemap" onclick="selectDeptTree()"></i>
                        <input id="treeName" class="am-form-field am-radius" name="parentName" type="text" onclick="selectDeptTree()" value="${(sysDept.parentName)!}" readonly required/>
                    </div>
                    <div class="am-form-group am-u-sm-12 am-u-md-6 am-u-lg-4">
                        <label class="is-required">显示排序：</label>
                        <input class="am-form-field am-radius" type="number" name="orderNum" value="${(sysDept.orderNum)!}" required />
                    </div>
                    <div class="am-form-group am-u-sm-12 am-u-md-6 am-u-lg-4">
                        <label>负责人：</label>
                        <input class="am-form-field am-radius" type="text" name="leader" value="${(sysDept.leader)!}" />
                    </div>
                    <div class="am-form-group am-u-sm-12 am-u-md-6 am-u-lg-4">
                        <label>联系电话：</label>
                        <input class="am-form-field am-radius" type="text" name="phone" value="${(sysDept.phone)!}" />
                    </div>
                    <div class="am-form-group am-u-sm-12 am-u-md-6 am-u-lg-4">
                        <label>邮箱：</label>
                        <input class="am-form-field am-radius" type="text" name="email" value="${(sysDept.email)!}" />
                    </div>
                    <div class="am-form-group am-u-sm-12 am-u-md-6 am-u-lg-4">
                        <label class="is-required">部门状态：</label>
                        <select class="am-radius" name="status" required>
                            <option value="">-- 请选择 --</option>
                            [#list dict.getType("sys_normal_disable") as dict]
                                [#if dict.dictValue == sysDept.status ]
                                    <option value="${dict.dictValue!}" selected>${dict.dictLabel}</option>
                                [#else]
                                    <option value="${dict.dictValue!}">${dict.dictLabel}</option>
                                [/#if]
                            [/#list]
                        </select>
                    </div>
                    <div class="am-form-group am-u-sm-12 am-u-md-12 am-u-lg-12">
                        <label>备注：</label>
                        <textarea class="am-radius" name="remark" rows="5" >${(sysDept.remark)!}</textarea>
                    </div>
                [/@dataForm]
            </div>
        [/@formMain]

        <!-- PC/APP 右侧悬浮按钮 -->
        [@rightToolbar /]

        [@script js=["fw", "validate"] progress="false" ]
            <script type="text/javascript">
                var prefix = ctx + "osfw/system/manage/dept";

                $("#form-dept-add").validate({
                    rules: {
                        deptName: {
                            maxlength: 50,
                            remote: {
                                url: prefix + "/checkDeptNameUnique",
                                type: "post",
                                dataType: "json",
                                data: {
                                    "deptId": function () {
                                        return $.common.trim($("input[name='deptId']").val());
                                    },
                                    "deptName": function () {
                                        return $.common.trim($("input[name='deptName']").val());
                                    }
                                },
                            }
                        },
                        orderNum: {
                            digits:true,
                            maxlength: 4,
                        },
                        leader: {
                            maxlength: 20,
                        },
                        phone:{
                            maxlength: 11,
                            isPhoneOrTel : true
                        },
                        email: {
                            maxlength: 50,
                            email: true
                        },
                        remark: {
                            maxlength: 500
                        },
                    },
                    messages: {
                        deptName: {
                            remote: "此部门名称已经存在"
                        },
                        orderNum: {
                            digits: "只能输入正整数"
                        }
                    },
                    onkeyup: false,
                    focusCleanup: true,
                });

                function selectDeptTree() {
                    var treeId = $("#treeId").val();
                    var deptId = $.common.isNotEmpty(treeId) ? treeId : 0;
                    var url = ctx + "osfw/system/manage/dept" + "/selectDeptTree/" + deptId;
                    $.modal.open('部门选择', url, "380", "500", doSubmit);
                }

                function doSubmit(index, modalo) {
                    var iframeWin = modalo.find('iframe')[0];
                    var treeId = iframeWin.contentWindow.document.querySelector('#treeId').value;
                    var treeName = iframeWin.contentWindow.document.querySelector('#treeName').value;
                    $("#treeId").val(treeId);
                    $("#treeName").val(treeName);
                    $.modal.close(index);
                }

                function clearDeptTree() {
                    $("#treeId").val("0");
                    $("#treeName").val("");
                }

                function submitHandler() {
                    if($.validate.form()) {
                        $.operate.save(prefix + "/edit", $('#form-dept-edit').serialize());
                    }
                }
            </script>
        [/@script]
    [/@body]
[/@html]